<template>
    <div>
        <el-form :model="form" :rules="rules" ref="ruleform" label-width="80px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="仓库名"  prop="ckmc">
                        <el-input v-model="form.ckmc" autocomplete="off"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="仓库类型"  prop="cklx">
                        <el-input v-model="form.cklx" autocomplete="off"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="负责人"  prop="fzr">
                        <el-input v-model="form.fzr" autocomplete="off"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="地址"  prop="address">
                        <el-input v-model="form.address" autocomplete="off"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="仓库代码"  prop="ckdm">
                        <el-input type="number" v-model="form.ckdm" autocomplete="off"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="showAddDialog = false">取 消</el-button>
            <el-button type="primary" @click="handleConfine">确 定</el-button>
        </div>
    </div>
</template>

<script>
  export default {
    name: 'index',
    data(){
      return{
        form: {
          ckdm: '',
          ckmc: '',
          cklx: '',
          fzr: '',
          address: '',
          dazt: '使用中',
        },
        rules: {
          ckdm: [
            { required: true, message: '请输入仓库代码', trigger: 'blur' },
          ],
          ckmc: [
            { required: true, message: '请输入仓库名', trigger: 'blur' },
          ],
          cklx: [
            { required: true, message: '请输入仓库类型', trigger: 'blur' },
          ],
          fzr: [
            { required: true, message: '请输入负责人', trigger: 'blur' },
          ],
          address: [
            { required: true, message: '请输入地址', trigger: 'blur' },
          ],

        }
      }
    },
    methods:{
      //确认添加
      handleConfine() {
        var validate = false;
        this.$refs['ruleform'].validate((valid) => {
          if (valid) {
            validate = true;
          } else {
            console.log('error submit!!');
            validate = false;
            return false;
          }
        });
        if (validate === false) {
          return;
        }
        setTimeout(()=>{
          this.form.id = Math.ceil(Math.random()*100);
          // this.tableData.push(this.form);
          // this.$store.commit('addSkuDatas',this.form)
          this.addcangkuDatas(this.form)
        },2000)
        this.showAddDialog = false;
        this.$message.success("添加成功!");

      },
    }
  };
</script>

<style scoped>

</style>
